<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Vue的组件</title>
</head>
<body>
<div id="app">
<!--    组件传递值-->
    <my-vue v-for="item in items" v-bind:xgp="item"></my-vue>
</div>

<!--导入Vue-->
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script>

    //定义一个Vue组件component
    Vue.component("my-vue",{
        props: ['xgp'],
        template: '<li>{{xgp}}</li>'
    });

    var vm = new Vue({
        el:"#app",
        data:{
            items: ["java","Linux","前端"]
        }
    });
</script>
</body>
</html>
